<template>
  <div>
    <div class="exclusive">
      <!-- 视频的标记 -->
      <div class="el-icon-video-play"></div>
      <!-- 图片 -->
      <img :src="item.sPicUrl" alt="" />
    </div>
    <div class="wenzi">{{item.copywriter}}</div>
  </div>
</template>

<script>
export default {
  name: "Exclusive",
  props:{
      item:{
          type:Object,
          default:""
      }
  }
};
</script>

<style lang="less" scoped>
// 控制视屏图标
.el-icon-video-play {
  font-size: 40px;
  color: #444;
  position: absolute;
  top: 10px;
  left: 10px;
}
.exclusive {
  width: 100%;
  height: 170px;
  position: relative;
  cursor: pointer;
  img {
    width: 100%;
    height: 100%;
    border-radius: 10px;
  }
  .wenzi {
    word-break: break-all;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2; /* 这里是超出几行省略 */
    overflow: hidden;
    color: #666;
    cursor: pointer;
  }
  .wenzi:hover{
      color: black;
  }
}
</style>